<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>小米官网</title>
		<link rel="shortcut icon" href="favicon.ico">
		<link rel="stylesheet" type="text/css" href="css/base.css"/>
		<link rel="stylesheet" type="text/css" href="css/commont.css"/>
	</head>
	<body>
	<div class="Total-box">
<!-- 头部开始 -->
			<header>
<!-- 上方推广图 -->
				<div class="header-top">
					<div class="img-top box-cont"><img src="./images/header-top.PNG" ></div>
				</div>
<!-- 导航栏开始 -->
				<nav>
					<div class="box-cont">
						<ul class="fl-l">
							<li><a href="">小米商城</a></li>
							<li></li>
							<li><a href="">MIUI</a></li>
							<li></li>
							<li><a href="">IoT</a></li>
							<li></li>
							<li><a href="">云服务</a></li>
							<li></li>
							<li><a href="">天星数科</a></li>
							<li></li>
							<li><a href="">有品</a></li>
							<li></li>
							<li><a href="">小爱开放平台</a></li>
							<li></li>
							<li><a href="">企业团购</a></li>
							<li></li>
							<li><a href="">资质证照</a></li>
							<li></li>
							<li><a href="">协议规则</a></li>
							<li></li>
							<li><a href="" id="app">下载app</a></li>
							<li></li>
							<li><a href="">智能生活</a></li>
							<li></li>
							<li><a href="">Select Location</a></li>
						</ul>
						<ul class="fl-r fr">
							<li><a href="">登陆</a></li>
							<li></li>
							<li><a href="">注册</a></li>
							<li></li>
							<li><a href="">消息通知</a></li>
							<li></li>
							<li class="shopping"><a href="" id="shopcar">购物车&nbsp(0)</a></li>
						</ul>
						<div id="QR">
							<div><img  src="images/QR.PNG"></div>
							<div>小米商城App</div>
						</div>
						<div id="shopcar-cont">购物车中还没有商品,赶紧选购吧</div>
					</div>
				</nav>
<!-- 搜索栏开始 -->
				<div class="header-top-middle">
					<div class="box-cont">
						<div id="logo-box" title="小米首页">
							<div id="logobox" class="logo fl">
								<img class="fl" id="logo" src="images/logo.PNG" > 
								<img class="fl" src="images/logo2.PNG" >
							</div>
						</div>
						<div class="nav-cont">
							<ul class="fl">
								<li><a href="">小米手机</a></li>
								<li><a href="">Redmi&nbsp;红米</a></li>
								<li><a href="">电视</a></li>
								<li><a href="">笔记本</a></li>
								<li><a href="">家电</a></li>
								<li><a href="">路由器</a></li>
								<li><a href="">智能硬件</a></li>
								<li><a href="">服务</a></li>
								<li><a href="">社区</a></li>
							</ul>
						</div>
						<div class="search fl">
							<input class="search-r fl" type="text" placeholder="红米10" />
							<button type="button" class="btn fl"></button>
						</div>
					</div>
				</div>
<!-- 幻灯片开始-->
				<div class="slide-box">
					<div class="box-cont ib-cont">
						<div class="slide">
							<div id="img-group" class="img-group">
								<a href=""><img src="images/hdp1.jpg " alt=""></a>
								<a href=""><img src="images/lb2.jpg" alt=""></a>
								<a href=""><img src="images/lb3.jpg" alt=""></a>
								<a href=""><img src="images/lb4.jpg" alt=""></a>
							</div>
							<div id="btn-group" class="btn-group">
								<div id="btn1"></div>
								<div id="btn2"></div>
								<div id="btn3"></div>
								<div id="btn4"></div>
							</div>
							<div id="btn-l"></div>
							<div id="btn-r"></div>
						</div>
						<div class="nav-l">
							<ul>
								<li><a href="">手机&nbsp;电话卡</a></li>
								<li><a href="">电视&nbsp;盒子</a></li>
								<li><a href="">笔记本&nbsp;显示器</a></li>
								<li><a href="">家电&nbsp;插线板</a></li>
								<li><a href="">出行&nbsp;穿戴</a></li>
								<li><a href="">智能&nbsp;路由器</a></li>
								<li><a href="">电源&nbsp;配件</a></li>
								<li><a href="">健康&nbsp;儿童</a></li>
								<li><a href="">耳机&nbsp;音箱</a></li>
								<li><a href="">生活&nbsp;箱包</a></li>
							</ul>
						</div>
					</div>
				</div>
<!-- 矢量图标导航开始 -->
				<div class="first-box">
					<div class="box-cont clearfix">
						<div class="V-icon fl">
							<a href=""><p></p>小米秒杀</a>
							<a href=""><p></p>企业团购</a>
							<a href=""><p></p>F码通道</a>
							<a href=""><p></p>米粉卡</a>
							<a href=""><p></p>以旧换新</a>
							<a href=""><p></p>话费充值</a>
						</div>
						<div class="img-right fl">
							<a href=""><img src="images/nav1.jpg" alt=""></a>
							<a href=""><img src="images/nav2.jpg" alt=""></a>
							<a href=""><img src="images/nav3.jpg" alt=""></a>
						</div>
					</div>
				</div>
			</header>
<!-- 内容开始	 -->
			<section>
<!-- 米闪购 -->
				<div class="msg box-cont">
					<div class="msg-top">
						<div class="fl" style="font-size: 25px; height: 50px;line-height: 40px;">小米闪购</div>
						<div class="fr">
							<button id="msg-l"></button>
							<button id="msg-r"></button>
						</div>
					</div>
					<div class="msg-l fl"><img src="images/图层.png" ></div>
					<div class="msg-r-box fr">
							<div class="msg-box fl" id="msg2">
								<div class="msg-r fl" >
									<div><a href=""><img src="images/图层1.png" ></a></div>
									<div><a href=""><img src="images/图层2.png" ></a></div>
									<div><a href=""><img src="images/图层3.png" ></a></div>
									<div><a href=""><img src="images/图层4.png" ></a></div>
								</div>
								<div class="msg-rr fl">
									<div><a href=""><img src="images/图层5.png" ></a></div>
									<div><a href=""><img src="images/图层6.png" ></a></div>
									<div><a href=""><img src="images/图层7.png" ></a></div>
									<div><a href=""><img src="images/图层8.png" ></a></div>
								</div>
							</div>
					</div>
					
				</div>
<!-- 手机分类 -->
				<div class="img-TV box-cont">
						<div class="nav-tv"><img src="images/sjtop.jpg" style="width: 100%;height: 100%; margin: 40px auto;"></div>
				</div>	
				<div class="box-cont phone">
					<div class="phone-nav clearfix">
						<div class="fl" style="color: #000000;">手机</div>
						<div class="fr"><a href="">查看全部</a></div>
					</div>
					<div class="img-phone">
						<div class="phone-l fl">
							<img src="images/sj.jpg" >
						</div>
						<div class="phone-r fr">
								<div>
									<img src="images/sj1.jpg" >
									<p class="phoneName">小米10至尊版</p>
									<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
									<p class="phoneMoney">5299元起</p>
								</div>
								<div>
									<img src="images/sj2.jpg" >
									<p class="phoneName">RedK30S&nbsp;至尊纪念版</p>
									<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
									<p class="phoneMoney">2599元起</p>
								</div>
								<div>
									<img src="images/sj3.jpg" >
									<p class="phoneName">腾讯黑鲨3</p>
									<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
									<p class="phoneMoney">1999元起</p>
								</div>
								<div>
									<img src="images/sj4.jpg" >
									<p class="phoneName">Red&nbsp;mi&nbsp;9A</p>
									<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
									<p class="phoneMoney">3699元起</p> 
								</div>
								<div>
									<img src="images/sj5.jpg" >
									<p class="phoneName">小米10&nbsp;青春版&nbsp;5</p>
									<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
									<p class="phoneMoney">599元起</p>
								</div>
								<div>
									<img src="images/sj6.jpg" >
									<p class="phoneName">小米10至尊版</p>
									<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
									<p class="phoneMoney">1999元起</p>
								</div>
								<div>
									<img src="images/sj7.jpg" >
									<p class="phoneName">小米10</p>
									<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
									<p class="phoneMoney">3799元起</p>
								</div>
								<div>
									<img src="images/sj8.jpg" >
									<p class="phoneName">Red &nbsp;mi&nbsp;K30&nbsp;Pro</p>
									<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
									<p class="phoneMoney">2999元起</p>
								</div>
						</div>
					</div>
<!-- 家电分类 -->
					<div class="img-TV box-cont">
						<div class="nav-tv"><img src="images/tv.jpg" style="width: 100%;height: 100%; margin: 40px auto;"></div>
					</div>	
					
					<div class="box-cont phone">
						<div class="phone-nav clearfix">
							<div class="fl" style="color: #000000;">家电</div>
							<div class="fr"><a href="">查看全部</a></div>
						</div>
						<div class="img-phone">
							<div class="phone-l fl">
								<img src="images/tv2.jpg" style="width: 230px;height: 330px;">
								<img src="images/tv1.jpg"style="width: 230px;height: 330px;margin-top:20px ;" >
							</div>
							<div class="phone-r fr">
									<div>
										<img src="images/tv3.jpg" >
										<p class="phoneName">Red&nbsp;mi红米电视&nbsp;70英寸</p>
										<p class="phoneSex">70K英寸，震撼巨屏，细腻如真</p>
										<p class="phoneMoney">3199元起</p>
									</div>
									<div>
										<img src="images/tv4.jpg" >
										<p class="phoneName">小米全面屏电视E32C</p>
										<p class="phoneSex">全面屏设计，人工智能系统</p>
										<p class="phoneMoney">899元起</p>
									</div>
									<div>
										<img src="images/tv5.jpg" >
										<p class="phoneName">小米全面屏电视E55A</p>
										<p class="phoneSex">全面屏设计，人工智能语言</p>
										<p class="phoneMoney">1499元起</p>
									</div>
									<div>
										<img src="images/tv6.jpg" >
										<p class="phoneName">米家互联网洗烘一体机</p>
										<p class="phoneSex">智能，省时省力</p>
										<p class="phoneMoney">2999元起</p> 
									</div>
									<div>
										<img src="images/tv7.jpg" >
										<p class="phoneName">米家空调5</p>
										<p class="phoneSex">出众静音，快速制冷热</p>
										<p class="phoneMoney">1499元起</p>
									</div>
									<div>
										<img src="images/tv8.jpg" >
										<p class="phoneName">Red&nbsp;mi全自动波轮洗衣机</p>
										<p class="phoneSex">一键操作，父母都爱用</p>
										<p class="phoneMoney">1999元起</p>
									</div>
									<div>
										<img src="images/tv9.jpg" >
										<p class="phoneName">四核，i7,16G,独显</p>
										<p class="phoneSex">全面均衡的国民轻薄本</p>
										<p class="phoneMoney">4899元起</p>
									</div>
									<div>
										<img src="images/tv10.jpg" >
										<p class="phoneName">Red &nbsp;mi&nbsp;K30&nbsp;Pro</p>
										<p class="phoneSex">120X变焦/120w秒冲/120Hz屏幕</p>
										<p class="phoneMoney">2999元起</p>
									</div>
							</div>
						</div>
				</div> 
<!-- 智能分类 -->
			<div class="img-TV box-cont">
					<div class="nav-tv"><img src="images/zntop.jpg" style="width: 100%;height: 100%; margin: 40px auto;"></div>
			</div>
			<div class="box-cont phone">
					<div class="phone-nav clearfix">
						<div class="fl" style="color: #000000;">智能</div>
						<div class="fr"><a href="">查看全部</a></div>
					</div>
					<div class="img-phone">
						<div class="phone-l fl">
							<img src="images/zn1.jpg" style="width: 230px;height: 330px;">
							<img src="images/zn2.jpg"style="width: 230px;height: 330px;margin-top:20px ;" >
						</div>
						<div class="phone-r fr">
								<div>
									<img src="images/zn3.jpg" >
									<p class="phoneName">Red&nbsp;mi红米电视&nbsp;70英寸</p>
									<p class="phoneSex">70K英寸，震撼巨屏，细腻如真</p>
									<p class="phoneMoney">3199元起</p>
								</div>
								<div>
									<img src="images/zn4.jpg" >
									<p class="phoneName">小米全面屏电视E32C</p>
									<p class="phoneSex">全面屏设计，人工智能系统</p>
									<p class="phoneMoney">899元起</p>
								</div>
								<div>
									<img src="images/zn5.jpg" >
									<p class="phoneName">小米全面屏电视E55A</p>
									<p class="phoneSex">全面屏设计，人工智能语言</p>
									<p class="phoneMoney">1499元起</p>
								</div>
								<div>
									<img src="images/zn6.jpg" >
									<p class="phoneName">米家互联网洗烘一体机</p>
									<p class="phoneSex">智能，省时省力</p>
									<p class="phoneMoney">2999元起</p> 
								</div>
								<div>
									<img src="images/zn7.jpg" >
									<p class="phoneName">米家空调5</p>
									<p class="phoneSex">出众静音，快速制冷热</p>
									<p class="phoneMoney">1499元起</p>
								</div>
								<div>
									<img src="images/zn8.jpg" >
									<p class="phoneName">Red&nbsp;mi全自动波轮洗衣机</p>
									<p class="phoneSex">一键操作，父母都爱用</p>
									<p class="phoneMoney">1999元起</p>
								</div>
								<div>
									<img src="images/zn9.jpg" >
									<p class="phoneName">四核，i7,16G,独显</p>
									<p class="phoneSex">全面均衡的国民轻薄本</p>
									<p class="phoneMoney">4899元起</p>
								</div>
								<div>
									<div style="width: 230px;height: 155px;"><img src="images/jd01.png" ></div>
									<div  style="width: 230px;height: 155px;margin-top: 20px;"><img src="images/jd02.png"></div>
								</div>
						</div>
					</div>
			</div>
			</section>
		<footer>
			<div class="box-cont">
				<div class="footer-top clearfix">
					<ul>
						<li><a href="">预约维修服务</a></li>
						<li></li>
						<li><a href="">⑦7天无理由退货</a></li>
						<li></li>
						<li><a href="">15天免费换货</a></li>
						<li></li>
						<li><a href="">满99元包邮</a></li>
						<li></li>
						<li><a href="">500余家售后网点</a></li>
					</ul>
					
					<div class="help fl">
						<table border="0"  class="table">
							<tr>
								<th>帮助中心</th>
								<th>服务支持</th>
								<th>线下门店</th>
								<th>关于小米</th>
								<th>关注我们</th>
								<th>特色服务</th>
							</tr>        
							<tr>         
								<td><a href="">账户管理</a></td>
								<td><a href="">售后政策</a></td>
								<td><a href="">小米之家</a></td>
								<td><a href="">了解小米</a></td>
								<td><a href="">新浪微博</a></td>
								<td><a href="">F码通道</a></td>
							</tr>         
							<tr>          
								<td><a href="">购物指南</a></td>
								<td><a href="">自助服务</a></td>
								<td><a href="">服务网点</a></td>
								<td><a href="">加入小米</a></td>
								<td><a href="">官方微信</a></td>
								<td><a href="">礼物码</a></td>
							</tr>   
							<tr>    
								<td><a href="">订单操作</a></td>
								<td><a href="">相关下载</a></td>
								<td><a href="">授权体验店</a></td>
								<td><a href="">投资者关系</a></td>
								<td><a href="">联系我们</a></td>
								<td><a href="">防伪查询</a></td>
							</tr>   
							<tr>    
								<td></td>
								<td></td>
								<td></td>
								<td><a href="">企业社会责任</a></td>
								<td><a href="">公益基金会</a></td>
								<td></td>
							</tr>   
							<tr>    
								<td></td>
								<td></td>
								<td></td>
								<td><a href="">廉洁举报</a></td>
								<td></td>
								<td></td>
							</tr>
						</table>
					</div>
					<div class="fr rr">
						<h4 style="font-size: 30px;color: #FF0000;">400-100-5678</h4>
						<p>8:00-18:00（仅收市话费)</p>
						<a class="kf">人工客服</a>
						<p>关注小米</p>
					</div>
					
					
				</div>
			</div>
			<div class="footer-bottom">
				<div class="box-cont">
					<img src="images/logo.PNG" class="fl">
					<div class="fl">
						<p class="foot-nav">
							<a href="">小米商城</a>
							|<a href="">MIUI </a>
							|<a href="">米家</a>
							|<a href="">多看 </a>
							|<a href="">米聊</a>
							|<a href="">游戏</a>
							|<a href="">政企服务</a>
							|<a href="">小米天猫店</a>
							|<a href="">小米集团隐私政策</a>
							|<a href="">小米公司儿童信息保护规则</a>
							|<a href="">小米商城隐私政策</a>
							|<a href="">小米商城用户协议</a>
							|<a href="">问题反馈</a>
							|<a href="">Select Location</a>
						</p>
						<p>
							<a href="">© mi.com </a>
							<a href="">京ICP证110507号</a> 
							<a href="">京ICP备10046444号</a> 
							<a href="">京公网安备11010802020134号</a>
							 <a href="">京网文[2020]0276-042号</a>
						</p>
						<p>
							 <a href="">（京）网械平台备字（2018）第00005号</a>
							 <a href="">互联网药品信息服务资格证 </a>
							 <a href="">(京)-非经营性-2014-0090</a> 
							 <a href="">营业执照</a> 
							 <a href="">医疗器械质量公告</a>
						</p>
						<p>
							 <a href="">增值电信业务许可证</a>
							 <a href="">网络食品经营备案</a> 
							 <a href="">京食药网食备202010048</a>
								<a href=""></a>
						</p>
						<p>
							<a href="">违法和不良信息举报电话：171-5104-4404 </a>
							<a href="">知识产权侵权投诉</a> 
							<a href="">本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</a> 
						</p>
					</div>
					<div class="img-TV box-cont">
						<a href=""><div class="nav-tv"><img src="images/footer.PNG" style="width: 100%;height: 100%; margin: 40px auto;"></div></a>
					</div>	
				</div>
			</div>
			
		</footer>
	</div>
		<script src="js/index.js"></script>
	</body>
</html>
